<template>
  <div>
      <Table border :columns="columns" :data="list"  >
        <template #createAt={row}>
          <div class="c">{{getTime(row.createAt)}}</div>
        </template>
        <template #action={index}>
         <Button type="error" @click="del(index)"> 删除</Button>
        </template>
    </Table>
  </div>
</template>

<script>
import store from '@/vuex/store';
import { mapState, mapMutations } from 'vuex';
import Distpicker from 'v-distpicker';
export default {
  name: 'MyAddress',
  data () {
    return {
      columns: [
        {
          title: '反馈用户',
          key: 'user',
          width: 400
        },
        {
          title: '标题',
          key: 'title',
          width: 400
        },
        {
          title: '内容',
          key: 'content'
        },
        {
          title: '提交时间',
          width: 260,
          key: 'createAt'
        },
        {
          title: '操作',
          width: 200,
          slot: 'action',
          fixed: 'right'
        }
      ],
      thfs: 0,
      kyjyy: 0,
      kcyj: 0,
      value1: '',
      haha: [
        'static/img/goodsDetail/pack/1.jpg',
        'static/img/goodsDetail/pack/2.jpg',
        'static/img/goodsDetail/pack/3.jpg',
        'static/img/goodsDetail/pack/4.jpg',
        'static/img/goodsDetail/pack/5.jpg',
        'static/img/goodsDetail/pack/6.jpg',
        'static/img/goodsDetail/pack/7.jpg',
        'static/img/goodsDetail/pack/8.jpg',
        'static/img/goodsDetail/pack/9.jpg'

      ],
      modal: false,
      tyjFlag: false,
      modal1: false,
      formData: {
        intro: '',
        img: '',
        price: '',
        values: '',
        create_at: '',
        size: ''
      },
      ruleInline: {
        intro: [
          { required: true, message: '请输入标题', trigger: 'blur' }
        ]
      },
      listIndex: 0,
      list: [],
      obj: '',
      mxtime: {
        hours: 1,
        minute: 38,
        seconds: 36
      }
    };
  },
  created () {
    // const obj = localStorage.getItem('userorder') || [];
    this.list = JSON.parse(JSON.stringify(this.userfklist));
    // this.list = [JSON.parse(JSON.stringify(localStorage.getItem('userorder')))];
  },
  computed: {
    ...mapState(['userfklist', 'seckills'])
  },
  methods: {
    ...mapMutations(['SET_USERFK']),
    edit (index) {
      this.modal = true;
      this.listIndex = index;
    },
    add0 (m) { return m < 10 ? '0' + m : m; },
    getTime (q) {
      var time = new Date(q);
      var y = time.getFullYear();
      var m = time.getMonth() + 1;
      var d = time.getDate();
      var h = time.getHours();
      var mm = time.getMinutes();
      var s = time.getSeconds();
      return y + '-' + this.add0(m) + '-' + this.add0(d) + ' ' + this.add0(h) + ':' + this.add0(mm) + ':' + this.add0(s);
    },
    getTime2 (q) {
      var time = new Date(q);
      time.setDate(time.getDate() + 2);
      var y = time.getFullYear();
      var m = time.getMonth() + 1;
      var d = time.getDate();
      var h = time.getHours();
      var mm = time.getMinutes();
      var s = time.getSeconds();
      return y + '-' + this.add0(m) + '-' + this.add0(d) + ' ' + this.add0(h) + ':' + this.add0(mm) + ':' + this.add0(s);
    },
    cancel (i) {
      if (!i) {
        this.thfs = 0;
        this.kyjyy = 0;
        this.kcyj = 0;
        this.value1 = '';
      }
    },
    del (index) {
      this.$Modal.confirm({
        title: '信息提醒',
        content: '你确定删除这个意见反馈',
        onOk: () => {
          this.list.splice(index, 1);
          this.SET_USERFK(this.list);
          this.$Message.success('删除成功');
          this.list = JSON.parse(JSON.stringify(this.userfklist));
        },
        onCancel: () => {
          this.$Message.info('取消删除');
        }
      });
    },
    imghand (name) {
      this.formData.img = name;
      this.list[this.listIndex].img = name;
    }
  },
  components: {
    Distpicker
  },
  store
};
</script>

<style scoped>
.address-box {
  padding: 15px;
  margin: 15px;
  border-radius: 5px;
  box-shadow: 0px 0px 5px #ccc;
}
.address-header {
  height: 35px;
  display: flex;
  justify-content: space-between;
  color: #232323;
  font-size: 18px;

}
.address-header img {
height:50px
}
.address-content {
  font-size: 14px;
}
.address-content-title {
  color: #999;
}
.address-action span{
  margin-left: 15px;
  font-size: 14px;
  color: #2d8cf0;
  cursor: pointer;
}
.imgchan{
  display:inline-block;
  padding: 5px;
  margin:5px;
  border:#fff solid 1px
}
.imgclick{
border:red solid 1px
}
</style>
